<!--
 * @Author: 张升 1562821455@qq.com
 * @Date: 2023-06-20 15:48:35
 * @LastEditors: 张升 1562821455@qq.com
 * @LastEditTime: 2023-10-18 18:19:05
 * @FilePath: \vue2-demo\src\pages\render\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div id="render">
        <custom-element />
        =========================================================================================================
        <renderMap />
        =========================================================================================================
        <v-model-render />
    </div>
</template>
<script>
    import { Vue } from 'vue-property-decorator';
    import renderMap from './components/renderMap';
    import vModelRender from './components/vModelRender';
    Vue.component('custom-element', {
        render(h, params){
            return h('div', {
                style: {
                    border: '2px solid pink',
                    background: '#888',
                }
            }, [
                h('span', {
                    style: {
                        width: '200px',
                        height: '200px',
                        background: 'pink',
                        margin: '20px'
                    },
                    domProps: {
                        innerHTML: '测试render',
                    }
                }),
                h('el-date-picker', {
                    props: {
                        type: 'date',
                        placeholder: '选择日期吧啊哈哈'
                    },
                }),
                h('el-button', {
                    props: {
                        type: 'primary',
                        round: 'round',
                    },
                    style: {
                        marginLeft: '20px'
                    },
                    domProps: {
                        innerHTML: '按钮哈哈'
                    }
                }),
            ])
        }
    })
    export default {
        components: {
            renderMap,
            vModelRender,
        }
    }
</script>
<style lang="less">

</style>